<?php
    include('inc/pages_head.php');
?>
<body>
<!--============================== Header =================================-->
<header>
  <div class="container_12">
    <h1><a class="logo" href="index.html"><img src="images/logo.png" alt="logo"  /></a></h1>
    <div class="nav_wrap">
      <div class="nav_wrap_inner">
        <div class="responsibe_block">
          <div class=
"responsibe_block_inner"> <a href="#" class="resp_navigation"></a> </div>
        </div>
        <nav class="main-menu">
          <ul class="sf-menu">
            <li><a href="index.html">Home</a>
              <ul>
                <li><a href="index.html">Home Page 1</a></li>
                <li class="last_item"><a href="index2.html">Home Page 2</a></li>
              </ul>
            </li>
            <li><a href="about.html">About Us</a></li>
            <li><a href="services.html">Services</a></li>
            <li class="current"><a href="#">Portfolio</a>
              <ul>
                <li><a href="portfolio4.html">Portfolio 4</a></li>
                <li><a href="portfolio3.html">Portfolio 3</a></li>
                <li><a href="portfolio2.html">Portfolio 2</a></li>
                <li class="last_item"><a href="portfolio_masonry.html">Portfolio Masnory</a></li>
              </ul>
            </li>
            <li><a href="blog.html">Blog</a></li>
            <li class="last"><a href="contacts.html">Contact</a></li>
          </ul>
        </nav>
      </div>
    </div>
    <div class="clear"></div>
  </div>
</header>
<!--============================== Page Title =================================-->
<div class="wrapper pagetitle">
  <div class="container_12">
    <article class="grid_9">
      <h1 class="font_heading02"><span class="color_white">Portfolio</span> </h1>
      <p><span class="color_gray"><a href="index.html">home</a> &rarr; <a href="portfolio3.html">portfolio</a> &rarr; portfolio 3</span> </p>
    </article>
    <article class="grid_1 last-col" style="float:right;">
      <form method="get" id="searchform" action="#">
        <div class="bgsearch">
          <input type="text" name="s" id="s2" value="Site Search..." onFocus="if (this.value == 'Site Search...')this.value = '';" onBlur="if (this.value == '')this.value = 'Site Search...';" />
          <input type="submit" class="searchbutton2" value="" />
        </div>
      </form>
    </article>
    <div class="brd" style="margin-top:3px;"></div>
  </div>
</div>
<!--============================== Content ================================-->
<section id="content" class="cont_pad">
  <div class="container_12">
    <h1 class="font_heading02 color_black" style="font-size:50px;">We create awesome <span class="color_green">Websites</span> and beautifull <span class="color_green">Brand Identity</span></h1>
  </div>
</section>
<section class="cont_pad">
  <div class="container_12">
    <div class="filterable">
      <ul id="portfolio-nav">
        <li class="current"><a href="#" data-filter="*">All</a><span>/</span></li>
        <li><a data-filter=".web" href="#">Web Design</a><span>/</span></li>
        <li><a data-filter=".graphic" href="#">Graphic Design</a><span>/</span></li>
        <li><a data-filter=".branding" href="#branding">Brand Identity</a><span>/</span></li>
        <li><a data-filter=".photography" href="#">Photography</a></li>
      </ul>
    </div>
    <div class="portfolio-grid">
      <ul id="thumbs">
        <li class="col3 item web">
          <div class="view view-tenth"> <img src="images/pf/pic1.jpg" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic1.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3 item graphic">
          <div class="view view-tenth"> <img src="images/pf/pic2.jpg" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic2.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3 item graphic">
          <div class="view view-tenth"> <img src="images/pf/pic3.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic3.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3 item branding">
          <div class="view view-tenth"> <img src="images/pf/pic4.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic4.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3 item web">
          <div class="view view-tenth"> <img src="images/pf/pic5.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic5.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3 item graphic">
          <div class="view view-tenth"> <img src="images/pf/pic7.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic7.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3  item photography ">
          <div class="view view-tenth"> <img src="images/pf/pic8.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic8.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3 item branding">
          <div class="view view-tenth"> <img src="images/pf/pic9.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic9.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
        <li class="col3  item photography">
          <div class="view view-tenth"> <img src="images/pf/pic12.jpg" alt="" />
            <div class="mask">
              <h2>Title Here</h2>
              <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fug nulla pariatur.</p>
              <a href="images/pf/pic12.jpg" class="preview info" data-rel="prettyPhoto[web]" style="bottom:-100px;">preview</a> </div>
          </div>
        </li>
      </ul>
    </div>
  </div>
</section>
<?php
    include('inc/pages_footer.php');
?>
</body>
</html>
